// 合同详情：ContractDetails
import React, { useState } from 'react'
import 'antd/dist/antd.css'
import './index.scss'
import xinxi from './ad.png'

import { Select, Form, Input, DatePicker, Space, Button, Table, Modal } from 'antd'

const data1 = []
data1.push(
    {
        contract_name: '借款协议',
        contract_no: '1A3GD43G35FD1DF2',
        state: '已完成',
        signatory: '2人',
        signing_platform: '四季为农服务平台',
        datel: '2019-01-02 12:15:24',
    }
)
const columns1 = [
    {
        title: '合同名称',
        dataIndex: 'contract_name',
        key: 'contract_name',
        align: 'center',
    },
    {
        title: '合同编号',
        dataIndex: 'contract_no',
        key: 'contract_no',
        align: 'center',
    },
    {
        title: '状态',
        dataIndex: 'state',
        key: 'state',
        align: 'center',
    },
    {
        title: '签署人',
        dataIndex: 'signatory',
        key: 'signatory',
        align: 'center',
    },
    {
        title: '订单来著平台',
        dataIndex: 'signing_platform',
        key: 'signing_platform',
        align: 'center',
    },
    {
        title: '提交时间',
        dataIndex: 'datel',
        key: 'datel',
        align: 'center',
    },
]

const data2 = []
data2.push(
    {
        date2: '2019-01-29 16:21:43',
        operationg_user: '',
        ip: '47。105.40.113',
        account: '无',
        activity: '上传合同',
    },
    {
        date2: '2019-01-29 16:21:43',
        operationg_user: '李焕英',
        ip: '47。105.63.113',
        account: '15884868435',
        activity: '签署合同',
    },
    {
        date2: '2019-01-29 16:21:43',
        operationg_user: '',
        ip: '3.105.40.113',
        account: '155162646256',
        activity: '合同生效',
    },
)
const columns2 = [
    {
        title: '时间',
        dataIndex: ' date2',
        key: 'date2',
        align: 'center',
    },
    {
        title: '操作用户',
        dataIndex: 'operationg_user',
        key: 'operationg_user',
        align: 'center',
    },
    {
        title: 'ip地址',
        dataIndex: 'ip',
        key: 'ip',
        align: 'center',
    },
    {
        title: '相关账号',
        dataIndex: 'account',
        key: 'account',
        align: 'center',
    },
    {
        title: '具体活动',
        dataIndex: ' activity',
        key: ' activity',
        align: 'center',
    },
]

const data3 = []
data3.push(
    {
        real_name: '是',
        valid: '有效',
        operating_user: '李焕英',
        account: '1565481456',
        term: '2019-01-02 12:15:24',
    }
)
const columns3 = [
    {
        title: '是否实名',
        dataIndex: 'real_name',
        key: 'real_name',
        align: 'center',
    },
    {
        title: '是否有效',
        dataIndex: 'valid',
        key: 'volid',
        align: 'center',
    },
    {
        title: '证书主体',
        dataIndex: 'operating_user',
        key: 'operating_user',
        align: 'center',
    },
    {
        title: '账号',
        dataIndex: 'account',
        key: 'account',
        align: 'center',
    },
    {
        title: '有效期',
        dataIndex: 'term',
        key: 'term',
        align: 'center',
    },
]
export default function ContractDetails() {
    return (
        <div className='contractDetails'>
            <p className='p1'>当前状态：<span>已完成</span></p>

            <div className='xinxi'>
                <p>合同基本信息</p>
                <Table columns={columns1} dataSource={data1} bordered />
            </div>

            <div className='bushuxinxi'>
                <p>签署信息</p>
                <div className='img'>
                    <img src={xinxi} alt="" />
                </div>
            </div>

            <div className='xinxi'>
                <p>签署事件</p>
                <Table columns={columns2} dataSource={data2} bordered />
            </div>

            <div className='xinxi'>
                <p>用户证书</p>
                <Table columns={columns3} dataSource={data3} bordered  />
            </div>
        </div>
    )
}
